<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>地址管理页面</title>
    <script src="js/jquery.min.js"></script>
    <script src="js/addressPage.js"></script>
    <script src="js/HttpUtil.js"></script>
    <script src="js/CacheUtil.js"></script>
    <!--bootstrap-->
    <link rel="stylesheet" type="text/css" href="css/login2.css">
    <link href="bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <script src="bootstrap/js/bootstrap.min.js"></script>
</head>
<body>
<div  id="header"></div>
<!--网站中间内容开始-->
<div id="dingdanxiangqing_body">
    <div id="dingdanxiangqing_body_big">
        <div id="big_left">

        </div>
        <div id="big_right" style="height: 500px;overflow: scroll;">

            <div style="margin:0 20px;">
                <h3>收货地址</h3>
                <hr>
                <table class="table table-striped table-hover table-bordered">
                    <tr id="addressHead">
                        <th>序号</th><th>收件人</th>
                        <th>手机号</th><th>地址</th>
                        <th>操作</th>
                    </tr>

<!--                    遍历地址位置-->



                </table>
            </div>
            <br>
            <div class="container" style="width:960px;">

                <form action="" method="post" class="form-horizontal">
                    <div class="form-group">
                        <label class="col-sm-2 form-label">收件人</label>
                        <div class="col-sm-3">
                            <input type="text" class="form-control" name="name" id="addressName"/>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 form-label">手机号</label>
                        <div class="col-sm-3">
                            <input type="text" class="form-control" name="phone" id="addressPhone"/>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="form-label">详细地址</label>
                        <textarea rows="3" class="form-control" name="detail" id="addressDetail"></textarea>
                    </div>
                    <div class="form-group col-md-12">
                        <input type="submit" class="btn btn-primary" value="添加地址" onclick="submitAdd()"/>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<!--遍历地址模板-->
<template id="template_address">
    <tr>
        <Td>{count}</Td>
        <td>{addressName}</td>
        <td>{addressPhone}</td>
        <td>{addressDetail}</td>
        <td>
            <button onclick="deleteAddr({addressId})" class="btn btn-danger btn-sm">删除</button>&nbsp;&nbsp;
            <button class="btn btn-default btn-sm" data-toggle="modal" data-target="#myModal{addressId}" >修改</button>&nbsp;&nbsp;
            <!-- 弹出模态框 -->

            <div class="modal fade" tabindex="-1" role="dialog" id="myModal{addressId}">
                <div class="modal-dialog" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal">
                                <span>&times;</span>
                            </button>
                            <h4 class="modal-title">修改地址</h4>
                        </div>
                        <form action="" method="post" class="form-horizontal">
                            <div class="motal-body">
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">收件人</label>
                                    <div class="col-sm-10">
                                        <input type="hidden" name="id" value="{addressId}">
                                        <input type="hidden" name="level" value="{addressState}">
                                        <input type="text" name="name" class="form-control" value="{addressName}" id="updateAddressName{addressId}">
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">电话</label>
                                    <div class="col-sm-10">
                                        <input type="text" name="phone" class="form-control" value="{addressPhone}" id="updateAddressPhone{addressId}">
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">收件地址</label>
                                    <div class="col-sm-10">
                                        <input type="text" name="detail" class="form-control" value="{addressDetail}" id="updateAddressDetail{addressId}">
                                    </div>
                                </div>

                            </div>
                            <div class="motal-footer">
                                <button type="submit" class="btn btn-primary" onclick="updateAddressBtn({addressId})">修改</button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>

<!--            <button onclick="defaultAddr({addressId})" class="btn btn-primary btn-sm">设为默认</button>-->
            <!--待判断是否默认状态-->
<!--            <span class="badge" style="background-color:red;">默认</span>-->
<!--            <span class="badge">普通</span>-->
        </td>
    </tr>
</template>



<script>
    $(document).ready(function(){
        $("#header").load("header.html");
    });
</script>

</body>
</html>